/** @jsxImportSource @emotion/react */
import * as React from "react";
import {
    CCell, Cell, TableRow, useTheme,
} from "customize-easy-ui-component";
import {DirectLink} from "../../../routing/Link";
// import {RecordInputConfig, RecordIspArea, RecordSelfSplit,itemResTransform, } from "../../common/config";
import {
    EvaluateItemConfig,
    itemFenXianClassTransform,
    RecordEvalArea
} from "../config";
import {css} from "@emotion/react";

/**格式化版原始记录：科研类，默认的打印字体缩小。
 * @param dfsz 描述区域的字体大小,打印才起作用
 * @param ltsz 其它长文本可能的列的字体大小,打印才起作用
 * 每一行都加上ID方便定位。
 * */
export const useFormatLikeSciSaf= ({itRes, ItemArs, model,ver, repNo, rssCB, orc,dfsz,ltsz}
                                           :{itRes:any, ItemArs:RecordEvalArea[], model:string,ver:string, repNo:string,
            rssCB?:({itRes,seq,area,et, n,ox,oy,oz,nowColumns,big,titl} :any)=>React.ReactNode,
            orc?:any,dfsz?:string,ltsz?:string}
) => {
    const theme = useTheme();
    const descStyle = React.useMemo(() => {
        return css({
            "& > span": {fontSize: `0.875rem`},
            "& > div > span": {fontSize: `0.875rem`},
            "& > div > div > table td": {fontSize: `0.875rem`},
            "& > span > div > table td": {fontSize: `0.875rem`},
            "@media print": {
                "& > span": {fontSize: `${dfsz??'0.7'}rem`},
                "& > div > span": {fontSize: `${dfsz??'0.7'}rem`},
                "& > div > div > table td": {fontSize: `${dfsz??'0.7'}rem`},
                "& > span > div > table td": {fontSize: `${dfsz??'0.7'}rem`},
            }
        });
    }, [dfsz,theme]);
    const longStyle = React.useMemo(() => {
        return css({
            fontSize: `0.875rem`,
            "@media print": {
                fontSize: `${ltsz??'0.7'}rem`,
            }
        });
    }, [ltsz,theme]);
    const renderIspContent =React.useMemo(() => {
        let seq = 0;
        let htmlTxts =[] as React.ReactNode[];
        let ox: string;
        let oy: string;
        let oz: string;
        let big: string;
        let titl: string | React.ReactElement<any, string | React.JSXElementConstructor<any>> | number | Iterable<React.ReactNode> | React.ReactPortal | boolean;
        let sub: string;
        ItemArs?.forEach((area, b) => {
            //列跨 span X.y的X列这里就不要跨越area范围了；以一个tag对应的area.items最大搜索区域来决定各个列span;当前已经为x,y,z,t分配的具体行数多少。
            //配置已经敲定了有几行， td跨越几行
            area && area.items.forEach((et:EvaluateItemConfig, n:number) => {
                if(et){
                    seq += 1;
                    let nowColumns;    //有几列， 得依据范围内的全部项目来判定各个列到底会跨越几行的（自拆分项目会有多方=行的），x.y.z.t分别决定。
                    if(et.y) nowColumns=2;
                    else if(et.x) nowColumns=1;
                    else throw new Error(`非法列设置gs`);
                    //出现特殊情形了：第二列又不要的但是x.y编码 是42.1A的；  注意bspan同时生效的！。配置需要协调清楚。
                    if(et.seco==='' && nowColumns===2)
                        nowColumns=1;
                    big=et.big??big;        //像缓存一样 传递下去，按最左边序号顺序上托没改动的就是不变。
                    ox=et.x??ox;
                    oy=et.y??oy;
                    // @ts-ignore
                    titl=et.titl??titl;
                    let rowId=`${ox}.${oy}`;        //跳转导航用
                    if(n===0 && rowId!==area.tag)   throw new Error(`非法标签`+area.tag);
                    let scoreN;
                    if(et.weight!==undefined){
                        if(typeof et.weight === 'number')
                            scoreN=itRes?.[et.name+'_F'] || '/';
                        else
                            scoreN="合并 "+et.weight;
                    }
                    let itemRowRender=[];
                    const {chendu, pinglv, fxclass}=itemFenXianClassTransform(itRes,et.name);
                    itemRowRender[0] =<TableRow id={rowId} key={n}>
                        <CCell key={1}>{et.x}</CCell>
                        { (et.bspan!)>0 && <CCell key={2} split={true} rowSpan={et.bspan} colSpan={1===nowColumns? 2:1}
                                               css={longStyle}>{et.big}</CCell>
                        }
                        {nowColumns>=2 && (et.tspan!)>0 && <CCell split={true} key={3} rowSpan={et.tspan}
                                                              css={longStyle}>{et.seco?? et.tips}</CCell>
                        }
                        <CCell key={4}>{et.pre??''}{et.x}.{et.y}{et.iclas??''}</CCell>
                        <CCell key={12} css={longStyle}>{et.titl}</CCell>
                        <Cell key={5} css={descStyle}>{et.desc}</Cell>
                        <CCell key={6}>{itRes?.[et.name]}</CCell>
                        {/*<CCell key={6}>{itemCheckResTransform(itRes,et.name)}</CCell>*/}
                        <CCell key={7}>{chendu || '/'}</CCell>
                        <CCell key={8}>{pinglv || '/'}</CCell>
                        <CCell key={9}>{fxclass}</CCell>
                        {(et.weight!==undefined) && <>
                            <CCell key={10} split={true} rowSpan={et.rspan??1}>{et.weight}</CCell>
                            <CCell key={11} split={true} rowSpan={et.rspan??1}>{scoreN}</CCell>
                        </>
                        }
                        <CCell key={10} css={longStyle}>{itRes?.[et.name+'_D'] || ''}</CCell>
                    </TableRow>;

                    const rowsBigArea=<React.Fragment key={seq}>
                        <DirectLink href={`/report/${model}/ver/${ver}/${repNo}/${area.tag}?original=1#${area.tag}`}>
                            {itemRowRender}
                        </DirectLink>
                    </React.Fragment>;
                    htmlTxts.push(rowsBigArea);    //原先在htmlTxts.push(itemRowRender);bigItemRowCnt++;前面就处理的
                }
            });
        });

        return  htmlTxts;
    }, [itRes,repNo,model,ver,ItemArs,descStyle,longStyle]);
    return { renderIspContent };
};
